<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet" type="text/css"/>
    <style>
        .login {
            background-color: #444 !important;
        }

        * {
            font-family: microsoft Yahei;
        }

        .login .logo {
            margin: 0 auto;
            margin-top: 60px;
            padding: 15px;
            text-align: center;
        }

        .login .content {
            background-color: #fff;
            width: 360px;
            margin: 0 auto;
            margin-bottom: 0px;
            padding: 30px;
            padding-top: 20px;
            padding-bottom: 15px;
        }

        .login .content h3 {
            color: #000;
        }

        .login .content h4 {
            color: #555;
        }

        .login .content p {
            color: #222;
        }

        .login .content .login-form,
        .login .content .forget-form {
            padding: 0px;
            margin: 0px;
        }

        .login .content .input-icon {
            border-left: 2px solid #35aa47 !important;
        }

        .login .content .input-icon .form-control {
            border-left: 0;
        }

        .login .content .forget-form {
            display: none;
        }

        .login .content .register-form {
            display: none;
        }

        .login .content .form-title {
            text-align: center;
            font-weight: 300;
            margin-bottom: 25px;
        }

        .login .content .form-actions {
            overflow: auto;
            background-color: #fff;
            clear: both;
            border: 0px;
            padding: 0px 30px 25px 30px;
            margin-left: -30px;
            margin-right: -30px;
        }

        .login .content .register-form .form-actions {
            border: 0;
            margin-bottom: 0;
            padding-bottom: 0px;
        }

        .login .content .form-actions .checkbox {
            margin-top: 8px;
            display: inline-block;
        }

        .login .content .form-actions .btn {
            margin-top: 1px;
        }

        .login .content .forget-password {
            margin-top: 25px;
        }

        .login .content .create-account {
            border-top: 1px dotted #eee;
            padding-top: 10px;
            margin-top: 15px;
        }

        .login .content .create-account a {
            display: inline-block;
            margin-top: 5px;
        }

        /* select2 dropdowns */
        .login .content .select2-container {
            border-left: 2px solid #35aa47 !important;
        }

        .login .content .select2-container .select2-choice {
            border-left: none !important;
        }

        .login .content .select2-container i {
            display: inline-block;
            position: relative;
            color: #ccc;
            z-index: 1;
            top: 1px;
            margin: 4px 4px 0px -1px;
            width: 16px;
            height: 16px;
            font-size: 16px;
            text-align: center;
        }

        .display-hide {
            display: none;
        }

        .login .content .has-error .select2-container i {
            color: #b94a48;
        }

        .login .content .select2-container a span {
            font-size: 13px;
        }

        .login .content .select2-container a span img {
            margin-left: 4px;
        }

        /* footer copyright */
        .login .copyright {
            text-align: center;
            margin: 0 auto;
            padding: 10px;
            color: #999;
            font-size: 13px;
        }

        @media (max-width: 480px) {
            /***
            Login page
            ***/
            .login .logo {
                margin-top: 10px;
            }

            .login .content {
                width: 280px;
            }

            .login .content h3 {
                font-size: 22px;
            }

            .login .checkbox {
                font-size: 13px;
            }
        }
    </style>
    <style>


    </style>
</head>
<body class="login">
<div class="logo">
    <a href="index.html">
        <img src="../../assets/admin/layout/img/logo-big.png" alt="">
    </a>
</div>
<div class="container">
    <div class="content">
        <!-- BEGIN LOGIN FORM -->
        <form class="login-form" action="/login" method="post">
            <h3 class="form-title">财政运营沙盘模拟</h3>
            {% if msg %}
                <div class="alert alert-danger">{{ msg }}</div>
            {% endif %}
            <div class="alert alert-danger display-hide">
                <button class="close" data-close="alert"></button>
                <span>
                请输入用户名和密码 </span>
            </div>
            <div class="form-group">
                <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
                <label class="control-label visible-ie8 visible-ie9">用户名</label>
                <div class="input-icon">
                    <i class="fa fa-user"></i>
                    <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="用户名" name="id">
                </div>
            </div>
            <div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">密码</label>
                <div class="input-icon">
                    <i class="fa fa-lock"></i>
                    <input class="form-control placeholder-no-fix" type="password" autocomplete="off"
                           placeholder="密码" name="password">
                </div>
            </div>
            <div class="form-actions">
                <button type="submit" class="btn pull-right" style="background-color:rgb(53,170,71);color:white;">
                    Login <i class="m-icon-swapright m-icon-white"></i>
                </button>
            </div>
        </form>
        <!-- END LOGIN FORM -->
    </div>
</div>

</body>
</html>